<template>
    <h2>注册页面</h2>
    <table>
        <tr>
            <td>登录名称:</td>
            <td>
                <input type="text" id="UL_Name" v-model="UL_Name" />
            </td>
        </tr>
        <tr>
            <td>登录密码:</td>
            <td>
                <input type="password" id="UL_Pwd" v-model="UL_Pwd" />
            </td>
        </tr>
        <tr>
            <td colspan="2" style="text-align: :center;">
                <input type="button" value="注册" @click="Register" class="btn-success" />
            </td>
        </tr>
    </table>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import axios from 'axios';

const UL_Name = ref('');
const UL_Pwd = ref('');

// 注册方法
const Register = () => {
    //判断用户名不能为空
    if (!UL_Name.value) {
        alert('用户名不能为空！');
        return;
    }

    //判断密码不能为空
    if (!UL_Pwd.value) {
        alert('密码不能为空！');
        return;
    }

    axios.post('https://localhost:44305//api/Users/PostUserRegister',
        {
            UL_Name: UL_Name.value,
            UL_Pwd: UL_Pwd.value
        })
        .then(res => {
            if (res.data > 0) {
                alert('注册成功');
                location.href = '/';
            }
            else if (res.data == -1) {
                alert('用户名已存在');
            }
            else {
                alert('注册失败');
            }

        })
        .catch(error => {
            console.log(error);
        })
}

</script>